<template>
  <van-tabbar v-model="active" route fixed>
    <van-tabbar-item replace to="/home" icon="home-o">首页</van-tabbar-item>
    <van-tabbar-item replace to="/classify" icon="qr">分类</van-tabbar-item>
    <van-tabbar-item replace to="/cart" icon="shopping-cart-o" :badge="totalCount">购物车</van-tabbar-item>
    <van-tabbar-item replace to="/mine" icon="user-o">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script>
export default {
    data() {
        return {
            active: '',
            total:0,
            cartLists: [],
        }
    },
    watch:{
        cartLists:{
            deep:true,  // 深度监听，监听深层次改变
            handler(v) {
                console.log(v);
                this.total = 0;
                v.forEach( item => {
                    this.total += item.bookNumber;
                })
            }
        }
    },
    computed: {
      totalCount() {
          let count = 0;
          this.cartLists.forEach( item => {
              count += item.bookNumber;
          })
          return count;
      },
    },
    methods: {
      getCartList() {
            this.$ajax.getCartOne({

            }).then((res) => {
                console.log(res);
                // if(res.length > 0) {
                    this.cartLists = res
                    // this.flag = true
                // } else {
                //     this.flag = false
                // }
            })
        },
    },
    mounted() {
        this.getCartList()
    }
}
</script>